<template>
  <h1>vue3</h1>
  <!-- 
    vue2
      v-model给组件绑定：value属性和input事件
    vue3
      1. v-model="xxx", 给组件绑定：modelValue属性和update:modelValue事件
        modelValue属性就是xxx数据
        update:modelValue事件，触发事件传递的参数，就会更新xxx数据的值
      
      2. v-model:xxx="xxx", 给组件绑定：xxx属性和update:xxx事件

      删除了 v-bind.sync
   -->
  <Child v-model="count" />

  <Son v-model:count="count" v-model:msg="msg" />
</template>

<script lang="ts">
import Child from "./Child.vue";
import Son from "./Son.vue";

export default {
  name: "App",
  components: { Child, Son },
  data() {
    return {
      count: 0,
      msg: "hello",
    };
  },
};
</script>

<style scoped></style>
